<template>
	<z-paging ref="paging" v-model="list" @query="getData" :loading-more-enabled="false">
		<view class="d-ccc">
			<view class="d-flex d-p-t-30 d-p-l-30 " v-if="list.length > 0">
				<u-avatar :src="list[0].member_photo" size="120rpx"></u-avatar>
				<view class="d-flex-1">
					<view class="d-font-32 d-ff d-bold d-m-l-22">{{ list[0].member_name }}</view>
					<view class="d-font-26 d-ff d-bold d-m-l-22 d-type">{{ list[0].member_type }}</view>
				</view>
				<view 
					style="width: 22%;height: 55rpx;background-color: #ffffff;color: #55aaff;border-radius: 25rpx 0% 0% 25rpx;font-size: 24rpx;"
					@click="renzhen()">
					<text style="margin-left: 20rpx;line-height: 55rpx;">{{instate}}</text>
				</view>
			</view>
		</view>
		<view class="d-p-l-30 d-p-r-32 d-box">
			<view class="d-card d-p-t-30 d-p-b-30">
				<u-grid>
					<u-grid-item @click="ticket">
						<u-image src="/static/m1.png" width="54rpx" height="54rpx"></u-image>
						<view class="d-font-26 d-m-t-10">我的票夹</view>
					</u-grid-item>
					<u-grid-item @click="card">
						<u-image src="/static/m2.png" width="54rpx" height="54rpx"></u-image>
						<view class="d-font-26 d-m-t-10">我的卡包</view>
					</u-grid-item>
					<u-grid-item @click="view">
						<u-image src="/static/m3.png" width="54rpx" height="54rpx"></u-image>
						<view class="d-font-26 d-m-t-10">我的场地</view>
					</u-grid-item>
				</u-grid>
			</view>

			<view class="d-card d-m-t-30 d-p-l-30 d-p-r-30">
				<view class="d-flex d-p-t-30 d-p-b-30 u-border-bottom" @click="order">
					<u-image src="/static/m4.png" width="48rpx" height="48rpx"></u-image>
					<view class="d-flex-1 d-font-26 d-m-l-26">我的订单</view>
					<u-icon name="arrow-right" color="#9FA0A1" size="28rpx"></u-icon>
				</view>
				<view class="d-flex d-p-t-30 d-p-b-30 u-border-bottom" @click="mycourses" v-if="type == 1">
					<u-image src="/static/m6.png" width="48rpx" height="48rpx"></u-image>
					<view class="d-flex-1 d-font-26 d-m-l-26">我的课程</view>
					<u-icon name="arrow-right" color="#9FA0A1" size="28rpx"></u-icon>
				</view>
				<view class="d-flex d-p-t-30 d-p-b-30 u-border-bottom" @click="family" v-if="type == 2">
					<u-image src="/static/a.jpg" width="48rpx" height="48rpx"></u-image>
					<view class="d-flex-1 d-font-26 d-m-l-26">我的家属</view>
					<u-icon name="arrow-right" color="#9FA0A1" size="28rpx"></u-icon>
				</view>
				<!-- <view class="d-flex d-p-t-30 d-p-b-30 u-border-bottom" @click="golfers">
					<u-image src="/static/m5.png" width="48rpx" height="48rpx"></u-image>
					<view class="d-flex-1 d-font-26 d-m-l-26">我的球友</view>
					<u-icon name="arrow-right" color="#9FA0A1" size="28rpx"></u-icon>
				</view> -->
				<!-- <view class="d-flex d-p-t-30 d-p-b-30 u-border-bottom" @click="paid">
					<u-image src="/static/m5.png" width="48rpx" height="48rpx"></u-image>
					<view class="d-flex-1 d-font-26 d-m-l-26">待付款</view>
					<u-badge value="3"></u-badge>
					<u-icon name="arrow-right" color="#9FA0A1" size="28rpx"></u-icon>
				</view> -->
				
				<view class="d-flex d-p-t-30 d-p-b-30" @click="$u.toast('敬请期待')">
					<u-image src="/static/m7.png" width="48rpx" height="48rpx"></u-image>
					<view class="d-flex-1 d-font-26 d-m-l-26">消费统计</view>
					<u-icon name="arrow-right" color="#9FA0A1" size="28rpx"></u-icon>
				</view>
				<!-- <view class="" v-html="member_id == 'ZP240161'">
					{{tokenid}}
				</view> -->
			<!-- 	<view class="d-flex d-p-t-30 d-p-b-30" @click="onphone">
					<u-image src="/static/m7.png" width="48rpx" height="48rpx"></u-image>
					<view class="d-flex-1 d-font-26 d-m-l-26">登录</view>
					<u-icon name="arrow-right" color="#9FA0A1" size="28rpx"></u-icon>
				</view> -->
			</view>
		</view>
	</z-paging>
</template>

<script>
import { getMember,checkState } from '@/common/api';
export default {
	data() {
		return {
			list: [],
			member_id:'',
			type:'',
			instate:'',
			tokenid: uni.getStorageSync('authorization_token'),
		};
	},
	onShow() {
		if (this.$refs.paging) this.$refs.paging.reload(false);
	},
	methods: {
		getData() {
			getMember()
				.then(res => {
					this.$refs.paging.complete([res]);
					this.member_id = res.member_id
					this.type = res.type
					uni.setStorageSync('member_id' , this.member_id)
					this.checkStateon()
				})
				.catch(err => {
					uni.$u.toast('服务器繁忙,请稍后再试!');
				});
		},
		ticket() {
			uni.$u.route({
				url: '/pages/mine/ticket'
			});
		},
		card() {
			uni.$u.route({
				url: '/pages/mine/card'
			});
		},
		view() {
			uni.$u.route({
				url: '/pages/mine/view'
			});
		},
		order() {
			uni.$u.route({
				url: '/pages/mine/order'
			});
		},
		paid() {
			uni.$u.route({
				url: '/pages/mine/paid'
			});
		},
		golfers() {
			uni.$u.route({
				url: '/pages/mine/golfers'
			});
		},
		family() {
			uni.$u.route({
				url: '/pages/mine/family'
			});
		},
		renzhen() {
			uni.$u.route({
				url: '/pages/mine/userinfo'
			});
		},
		onphone() {
			uni.$u.route({
				url: '/pages/mine/login'
			});
		},
		mycourses(){
			uni.$u.route({
				url: '/pages/mine/courses'
			});
			
		},
		checkStateon(){
			checkState({
				member_id:this.member_id
			}).then(res => {
				this.instate = res.text
			});
		}
		
		
	}
};
</script>

<style lang="scss">
.d-ccc {
	height: 250rpx;
	background-color: #59a0ff;
}

.d-ff {
	color: #fff;
}
.d-bold {
	font-weight: bold;
}
.d-box {
	margin-top: -70rpx;
}
.d-card {
	background: #ffffff;
	box-shadow: 0rpx 5rpx 38rpx 0rpx rgba(6, 0, 1, 0.1);
	border-radius: 30rpx;
}
.d-type{
	// padding: 5rpx 10rpx;
	// background-color: #ffffff;
	color: #ffffff;
	border-radius: 4rpx;
	height: 36rpx;
	// padding: 0 18rpx;
}
</style>
